{extend name="layout_modal" /}
{block name="content"}
<!-- Content Header (Page header) -->
<section class="content" style="padding-top:0px;">
<div class="row">
  <div class="box">
    <!-- /.box-header -->
    <!-- form start -->
    <form role="form" action="{:url('data_update')}">
      <div class="box-body">
        <div class="form-group">
          <label for="exampleInputEmail1">城市列表</label>
          <div style="">
            <span style="margin-right: 10px;">珠海市</span>
            <span style="margin-right: 10px;">珠海市</span>
            <span style="margin-right: 10px;">珠海市</span>
          </div>
        </div>
        <div class="form-group">
          <label for="exampleInputEmail1">添加城市</label>
          <div style="">
            <select class="form-control" name="province_code" style="width: 30%;" onchange="get_city(this, this.value)">
              <option value="">请选择省份</option>
              {volist name="list" id="v"}
              <option value="{$v.code}">{$v.title}</option>
              {/volist}
            </select>
            <select class="form-control" name="city_code" style="width: 30%;">
              <option value="">请选择城市</option>
            </select>
          </div>
        </div>
      </div>
      <input type="hidden" name="userid" value="{$info.userid}">
      <!-- /.box-body -->
    </form>
  </div>
</div>
</section>
<!-- /.content -->
{/block}
{block name="script"}
<script type="text/javascript">
  function get_city (obj, code) {
    $.post("{:url('city/get_city')}",{  code:code},function(datajson){
      if (!datajson) {
        return false;
      };
      var html = '';
      $.each(datajson, function(index, item) {
        html += '<option value="'+item.id+'">'+item.title+'</option>';
      });
      $(obj).next().html('');
      $(obj).next().append(html);
    }); 
  }
</script>
{/block}